<template>
  <div class="recent-visitor-item" @click="interestedProducts">
    <div class="avatar">
      <img mode="scaleToFill" :src="info.head" alt="">
    </div>
    <div class="visit-info">
      {{info.name}} 查看了你的名片<text class="num">{{info.hit}}</text>次
      <text class="time">{{createTime}}</text>
    </div>
    <div class="arrow"><van-icon name="arrow" color="rgba(217,217,217,1)"></van-icon></div>
  </div>
</template>

<script>
  import qs from "qs";
export default {
  name: "ac-recent-visitor",
  props: ['info'],
  methods: {
    interestedProducts(){
      Megalo.navigateTo({
        url: '/pages/interested-products?' + qs.stringify(this.info)
      })
    }
  },
  // created(){
  //   console.log('sdsd',this.info)
  // },
  computed:{
    createTime(){
      return this.info.createTime.split(' ')[0]
    }
  }
}
</script>

<style scoped lang="less">
  .recent-visitor-item{
    height:138px;
    margin-bottom: 24px;
    background:rgba(248,248,249,1);
    border-radius:16px;
    padding: 0 32px;
    display: flex;
    align-items: center;
    .avatar{
      display: inline-flex;
      img{
        width: 100px;
        height: 100px;
        border-radius: 50%;
      }
    }
    .visit-info{
      width: 100%;
      margin-left: 18px;
      font-size:32px;
      font-weight:400;
      color:rgba(0,0,0,1);
      .num{
        color: #FF4040;
      }
      .time{
        display: block;
        height:40px;
        font-size:28px;
        font-weight:400;
        color:rgba(150,156,161,1);
      }
    }
    .arrow{
      display: inline-flex;
      transform: translateX(12px);
    }
  }
</style>
